<html>
<head>
    <meta charset="utf-8">
    <title>关注的公众号</title>
    <link rel="stylesheet" type="text/css"  href="../../assest/plugins/bootstrap/css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="../../assest/css/win.css"/>
    <link rel="stylesheet" type="text/css" href="../../assest/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="./custom_follow.css">
</head>
<body>
<div class="page-container">
    <div class="page-border">
        <div id="my-follow">
            <div class="layout-left">
                <div class="my-follow-left-menu" v-sticky="{trigger: 0, bottom: 0}">
                    <div class="my-follow-left-menu-tit">关注的公众号文章 <i title="刷新数据" v-on="click:refreshPage()" class="fa fa-refresh"></i> </div>
                    <div class="my-follow-left-menu-search">
                        <div class="my-follow-left-menu-search-input">
                            <input type="text" placeholder="公众号名称" v-model="leftKey"/>

                            <div class="del" v-on="click:searchPublicNumHide()"></div>
                            <div class="icon-search" v-on="click:searchPublicNum()"></div>
                        </div>
                    </div>
                    <div class="" style="position:relative;">
                        <div class="my-follow-left-menu-list-all js-menu-list-all" style="display: none;" v-repeat="puclic_all_this:puclic_all" v-on="click:showAll()">
                            <div class="tit ">全部公众号(<span v-text="puclic_all_this.num"></span>)</div>
                        </div>
                        <div class="my-follow-left-menu-list" id="list_menu">
                            <ul class="my-follow-left-menu-list-public-group-ul">
                                <li class="my-follow-left-menu-list-public-group-li " id="{{data_i.group_id}}" v-repeat="data_i:leftData">
                                    <div class="tit {{data_i.group_id==group_id ? 'active' : ''}} {{data_i.arrow ? 'arrow-down' : ''}}"
                                         v-on="click:showGroupArticle(data_i)"
                                         >
                                        <span v-text="data_i.group_name"></span>(<span v-text="data_i.gzh_num"></span>)
                                        <span class="open-trigger" v-on="click:menuListShow(data_i, $event)"></span>

                                    </div>
                                    <ul class="my-follow-left-menu-list-public-ul {{data_i.arrow ? 'open' : ''}}">
                                        <li class="my-follow-left-menu-list-public-li clearfix"
                                            v-class="active:account_i.id==nowAccount.id"
                                            id="{{account_i.id}}"
                                            v-on="click:showOneArticle(account_i)"
                                            v-repeat="account_i : data_i.accounts">
                                            <img v-attr="src:account_i.avatar" alt=""/>
                                            <div class="" v-text="account_i.name"></div>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <ul class="my-follow-left-menu-list-public-ul " id="list_search">
                        <li class="my-follow-left-menu-list-public-li clearfix" id="{{data_i.id}}" v-on="click:showOneArticle(data_i)" v-repeat=" data_i: search_data">
                            <img v-attr="src:data_i.avatar" alt=""/>

                            <div class="" v-text="data_i.name"></div>
                        </li>
                    </ul>
                    <p id="resultNO" class="result-no" style="display:none;">没有找到相应的公众号</p>
                </div>
            </div>
            <div class="layout-right">
                <div class="page-title">
                    <h2><em v-text="rightTitle">全部公众号</em></h2>
                    <div class="right-top-btns">
                        <span v-on="click:fetchModalStatus=true" class="btn btn-info">
                            <i class="fa fa-refresh" v-class="fa-loading:fetchStatus"></i>
                            <strong v-if="fetchAutoStatus">自动</strong>
                            更新
                            <strong v-if="!fetchAutoStatus" v-text="is_in_all?'全部公众号':rightTitle"></strong>
                            <strong v-if="!fetchAutoStatus">的文章</strong><strong v-if="fetchStatus && !fetchAutoStatus">中</strong>
                            <strong v-if="fetchStatus && fetchAutoStatus">文章中</strong>
                        </span>

                        <span v-on="click:followList()" class="btn btn-primary"><i class="fa fa-plus"></i> 添加关注</span>
                        <span v-on="click:followList()" class="btn btn-danger"><i class="fa fa-cogs"></i> 管理关注的公众号</span>
                    </div>

                </div>

                <!--关注的公众号文章-->
                <div class="my-follow-article-all js-my-follow-article-all" v-if="is_in_all">

                    <div class="content-header" v-sticky="{trigger: 57}">
                        <span class="content-header-left pull-left" v-on="click:headerShow()">
                            <span class="pull-left" style="margin-right: 15px;">只显示头条</span>
                            <span class=" switch-button {{is_first? 'on' : 'off'}}"></span>
                        </span>
                        <div class="content-header-right js-content-header-right">
                            <div class="time-choice" v-class="active:date_range==30" v-on="click:latelyTime(30)">最近30天</div>
                            <div class="time-choice" v-class="active:date_range==15" v-on="click:latelyTime(15)">最近15天</div>
                            <div class="time-choice" v-class="active:date_range==7" v-on="click:latelyTime(7)">最近7天</div>
                            <div class="time-choice" v-class="active:date_range==3" v-on="click:latelyTime(3)">最近3天</div>
                            <div class="time-choice" v-class="active:date_range==1" style="border-left: 1px solid #dbdbdb" v-on="click:latelyTime(1)">昨天</div>
                        </div>
                    </div>

                    <table class="my-follow-article-all-table">
                        <thead v-sticky="{trigger: 124}">
                        <tr class="my-follow-article-all-table-header">
                            <th style="padding-left: 102px;">文章标题</th>
                            <th class="text-center" style="width: 100px;">微信名称</th>
                            <th class="text-center" style="width: 100px;">发布时间</th>
                            <th class="text-center" style="width: 100px;">更新时间</th>
                            <th class="text-center" style="width: 100px;" v-on="click:sortAll( sortKey == 'read_num-desc' ? '': 'read_num-desc')"> 阅读数
                                <i class="fa fa-sort-desc table-sort {{sortKey == 'read_num-desc' ? 'active': ''}}" aria-hidden="true"></i>
                            </th>
                            <th class="text-center" style="width: 80px;">类型</th>
                            <th class="text-center" style="width: 100px;">操作</th>
                        </tr>
                        </thead>
                        <tr v-repeat="article_i:article_all" id="{{article_i.id}}">
                            <td style="padding-left: 20px;">
                                <span v-if="article_i.is_original==1" style=" font-size: 12px; padding: 1px 3px;" class="label label-success">原创</span>
                                <a href="javascript:void(0);" v-on="click:openByOuter(article_i.article_url)" v-html="article_i.article_title"></a>
                            </td>
                            <td class="text-center" >{{article_i.gzh_name}}</td>
                            <td class="text-center" style="color: #999" v-text="article_i.publish_time"></td>
                            <td class="text-center" style="color: #999" v-text="article_i.update_time"></td>
                            <td class="text-center" v-text="article_i.read_num"></td>
                            <td class="text-center">
                                <div class="td{{article_i.content_type}} br2"></div>
                            </td>
                            <td class="text-center">
                                <span class="add-btn" title="添加到素材合成器" v-on="click:clickAddMaterial(article_i, $event)">
                                    <i class="fa fa-plus-square"></i>
                                </span>
                                |
                                <span class="add-btn" title="添加到别的公众号" v-on="click:clickAddMaterialElse(article_i, $event)">
                                    <i class="fa fa-external-link-square"></i>
                                </span>
                            </td>
                        </tr>

                    </table>
                    <div class="data-empty-tips" v-if="fetchAccounts.length>0 && article_all.length==0">
                        <img src="./img/rank-smile.png">
                        <p>文章更新中，请稍后再来</p>
                    </div>
                    <div class="data-empty-tips" v-if="!loading && fetchAccounts.length==0">
                        <img src="./img/rank-smile.png">
                        <p>还未关注公众号，请先 <a href="javascript:void(0);" v-on="click:addFollow()">关注公众号</a></p>
                    </div>
                    <div class="load-more none-visibility js-loadMoresingle" v-class="page_all.numPages>page_all.page?'':'hide'" v-on="click:loadMoreall()">加载更多</div>
                </div>

                <!--某个公众号关注的文章-->
                <div class="my-follow-article-one js-my-follow-article-one " id="articleOne" v-if="!is_in_all">

                    <div class="my-follow-article-one-header clearfix js-my-follow-article-one-header" style="height:50px;padding-top:10px;" v-sticky="{trigger:57}">
                        <div class="header-content">
                            <span class="wx-id d-inb" style="margin-right:20px;">微信号： <span v-text="article_header_wx.wx_account"></span></span>
                            <span class="update-time d-inb">更新时间：<span v-text="article_header_wx.update_time"></span></span>
                        </div>
                    </div>

                    <table class="my-follow-article-all-table">
                        <thead v-sticky="{trigger: 166}">
                        <tr class="my-follow-article-all-table-header">
                            <th style="padding-left: 102px;">文章标题</th>
                            <th class="text-center" style="width: 100px;">发布时间</th>
                            <th class="text-center" style="width: 100px;">更新时间</th>
                            <th class="text-center" style="width: 100px;" v-on="click:sortOne( sortKey == 'read_num-desc' ? '': 'read_num-desc')"> 阅读数
                                <i class="fa fa-sort-desc table-sort {{sortKey == 'read_num-desc' ? 'active': ''}}" aria-hidden="true"></i>
                            </th>
                            <th class="text-center" style="width: 100px;">类型</th>
                            <th class="text-center" style="width: 100px;">操作</th>
                        </tr>
                        </thead>
                        <tr v-repeat="article_one_i:article_one" data-id="{{article_one_i.id}}">
                            <td style="padding-left: 100px;position:relative">
                                <span v-if="article_one_i.is_original==1" style="font-size: 12px; padding: 1px 3px;" class="label label-success">原创</span>
                                <span>
                                    <a href="javascript:void(0);" v-on="click:openByOuter(article_one_i.article_url)" v-html="article_one_i.article_title"></a>
                                </span>

                                <div class="my-follow-arrow-left-time js-my-follow-arrow-left-time" data-text="{{article_one_i.article_text}}" v-if="article_one_i.idx=='1'" v-text="article_one_i.article_time"></div>
                            </td>
                            <td class="text-center" style="color: #999" v-text="article_one_i.publish_time"></td>
                            <td class="text-center" style="color: #999" v-text="article_one_i.update_time"></td>
                            <td class="text-center" v-text="article_one_i.read_num"></td>
                            <td class="text-center">
                                <div class="td{{article_one_i.content_type}} br2"></div>
                            </td>
                            <td class="text-center">
                                <span class="add-btn" title="添加到素材合成器" v-on="click:clickAddMaterial(article_one_i, $event)">
                                    <i class="fa fa-plus-square"></i>
                                </span>
                                |
                                <span class="add-btn" title="添加到别的公众号" v-on="click:clickAddMaterialElse(article_one_i, $event)">
                                    <i class="fa fa-external-link-square"></i>
                                </span>
                            </td>
                        </tr>
                    </table>
                    <div class="data-empty-tips" v-if="article_one.length==0">
                        <img src="./img/rank-smile.png">
                        <p>文章更新中，请稍后再来</p>
                    </div>
                    <div class="load-more none-visibility js-loadMoresingleOne" v-class="page_one.numPages>page_one.page?'':'hide'"  v-on="click:loadMoreOne()">加载更多</div>
                </div>
            </div>
            <div class="loading-warp" v-if="loading">
                <div class="loading-content">
                    <div class="spinner">
                        <div class="rect1"></div>
                        <div class="rect2"></div>
                        <div class="rect3"></div>
                        <div class="rect4"></div>
                        <div class="rect5"></div>
                    </div>
                    <p>加载数据中</p>
                </div>
            </div>


            <!-- 显示更新关注的公众号文章的 控制及进度  -->
            <div class="select-modal material-modal"  v-style="display: fetchModalStatus?'block':'none'">

                <div class="modal-scrollable" style="z-index: 10051;">
                    <div class="modal in" tabindex="-1" style="display:block; width: 600px; margin-left: -300px;margin-top: -120px;" aria-hidden="false">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" v-on="click:fetchModalStatus=false;">×</button>
                            <h4 class="modal-title">更新我关注的公众号文章</h4>
                        </div>
                        <div class="modal-body">
                            <div class="start-fetch" v-if="!fetchStatus && is_in_all">
                                共关注<span v-text="fetchAccounts.length">0</span>个公众号，是否开始更新文章？
                            </div>
                            <div class="start-fetch" v-if="!fetchStatus && !is_in_all">
                                是否开始更新 <strong v-text="nowAccount.name"></strong> 的文章？
                            </div>

                            <div class="start-fetch" v-if="fetchStatus && waitForAccount">
                                <p>正在准备更新列表...</p>
                                <p class="text-muted">更新过程比较漫长，请勿关闭客户端，耐心等待</p>
                            </div>
                            <div class="start-fetch" v-if="!waitForAccount && fetchStatus && !isFetchDone()">
                                <p>当前正在更新 <strong v-text="fetchProcessStatus.nowAccount.name"></strong> 的文章 </p>
                                <div class="progress">
                                    <div class="progress-bar progress-bar-striped active"  v-style="min-width: '2em', width: (fetchProcessStatus.done+fetchProcessStatus.error.length+1)/fetchProcessStatus.total*100 + '%' ">
                                        <span v-text="fetchProcessStatus.done+fetchProcessStatus.error.length+1">1</span>/<span v-text="fetchProcessStatus.total">1</span>
                                    </div>
                                </div>
                                <p v-if="fetchProcessStatus.error.length">更新失败的公众号： <span v-text="fetchProcessStatus.error|wx_name"></span></p>
                                <p class="text-muted">更新过程中可能需要多次输入验证码，验证完后才能继续;<br/>建议一次只更新部分账号.失败后单个尝试;<br/>更新过程比较慢，请勿关闭客户端</p>

                            </div>
                            <div class="start-fetch" v-if="!waitForAccount && fetchStatus && isFetchDone()">
                                <p>更新完成，成功 <span v-text="fetchProcessStatus.done"></span>个 <span v-if="fetchProcessStatus.error.length">，<strong v-text="fetchProcessStatus.error.length"></strong>个等待微小宝更新文章 </span> </p>
                                <p v-if="fetchProcessStatus.error.length">更新失败的公众号：： <span v-text="fetchProcessStatus.error|wx_name"></span></p>
                            </div>
                            <div class="start-fetch">
                                <div>
                                    <iframe id="verifyFrame" src="" frameborder="0" style="width:100%;height:200px;display:none;"></iframe>
                                </div>
                            </div>
                        </div>

                        <div class="modal-footer" v-if="!fetchStatus">
                            <a class="btn btn-primary" v-on="click:startFetch()"> 开始更新 </a>
                            <a class="btn btn-default" v-on="click:fetchModalStatus=false;"> 取消 </a>
                        </div>
                        <div class="modal-footer" v-if="fetchStatus">
                            <a class="btn btn-default" v-on="click:fetchDone()"> 确定 </a>
                        </div>
                        <div class="modal-footer" v-if="pause">
                            <a class="btn btn-default" v-on="click:restart()"> 继续 </a>
                        </div>
                    </div>
                </div>
                <div class="modal-backdrop in" style="z-index: 10050;"></div>
            </div>
            <!--   选择 账号单选   结束  -->
        </div>
    </div>
</div>

<script type="text/javascript" src="../../assest/plugins/jquery.min.js"></script>
<script type="text/javascript" src="../../assest/plugins/underscore-min.js"></script>
<script type="text/javascript" src="../../assest/plugins/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../assest/plugins/vue.min.js"></script>
<script type="text/javascript" src="../../assest/plugins/win.js"></script>
<script type="text/javascript" src="../../node_modules/sougou-spider/index.js"></script>
<script type="text/javascript" src="./custom_follow.js"></script>
<script>
    init();
    var SogouUtilUrl='http://www.wxb.com/js/Sogou.util.min.js';
    try{
        if(window.top.GUI.App.manifest.version=='9.8.7'){//开发模式
            SogouUtilUrl='../../assest/js/utils/mp.weixin.qq.util.js';
        }
    }catch (e){}

    $.getScript(SogouUtilUrl, function(){
    }).error(function () {
        console.log(arguments);
    });
</script>

</body>
</html>
